<template>
	<gui-page ref="guiPage" :customHeader="true">
		<template v-slot:gHeader>
			<nav-bar-custom left-icon="left" :title="$t('translationImage.processInspection')"></nav-bar-custom>
		</template>
		<template v-slot:gBody>
			<view style="width: 750rpx;overflow-x: auto;">
				<view class="h-table pqc-table" style="background: #fff;width: 750rpx;">
					<view class="h-tr h-tr-5 h-thead ">
						<view class="h-td">{{$t('translationImage.process')}}</view>
						<view class="h-td">{{$t('translationImage.classes')}}</view>
						<view class="h-td">{{$t('translationImage.means')}}</view>
						<view class="h-td">{{$t('translationImage.inspectionResult')}}</view>
						<!-- <view class="h-td">{{$t('translationImage.operation')}}</view> -->
						<view class="h-td">{{$t('translationImage.operation')}}</view>
					</view>
					<view :style="'height: calc(100vh - '+ navHeight +'px);overflow-y: auto;'">
						<view class="h-tr h-tr-5" v-for="(x,i) in data.testList" :key="i" :class="i%2 != 0 ? 'space-tdeven' : 'space-tdodd'">
							<view class="h-td">
								<view class="spaceline"></view>
								<view class="space-td">{{x.processNameShow}}</view>
							</view>
							<view class="h-td h-td-colspan h-td-rowspan">
								<block v-for="(k,index) in x.shifts" :key="index">
									<view class="h-tr h-tr-4">
										<!-- isYesterday(k.checkDate) ||  -->
										<view class="h-td" :class="(x.shifts.length > 1 && k.testCodes.length && index == 0) ? 'pqc-yesterday' : ''">{{k.shiftCodeShow}}</view>
										<view class="h-td h-td-colspan h-td-rowspan">
											<view class="h-tr h-tr-3" v-for="(l,s) in k.testCodes" :key="s">
												<view class="h-td">{{l.testTypeName}}</view>
												<view class="h-td" @click="look(x,k,l)">{{$t('translationImage.examine')}}</view>
												<!-- <view class="h-td" :class="l.isStart ? 'pqc-begun' : ''">
													<view @click="beginTest(x,k,l)">
														{{$t('translationImage.starCheckout')}}
													</view>
												</view> -->
												<view class="h-td" :class="l.isCheck ? 'pqc-begun' : ''">
													<view @click="inputTest(x,k,l)">
														{{$t('translationImage.entryInspection')}}
													</view>
												</view>
											</view>
										</view>
									</view>
								</block>
							</view>
						</view>
					</view>
				</view>
				<!-- 产线查看弹窗 -->
				<uni-popup ref="showDialog" type="center">
					<view class="input-dialog-box">
						<view class="input-dialog-content">
							<view class="gui-text" style="margin-bottom: 20rpx;">
								{{data.lookPopInfo.processName}}/{{data.lookPopInfo.shiftCode}}/{{data.lookPopInfo.testTypeName}}
							</view>
							<scroll-view :show-scrollbar="false" :scroll-y="true" class="scroll-view">
								<view class="itemview" v-for="(x,i) in data.lookList" :key="i">
									<view class="itemview-title">{{$t('multilingual.productionLine')}}：{{x.productionLineCode}}</view>
									<view class="itemview-sub" :class="(x.testTypeCode == 'FPH' ? x.noDestroyStatus : x.destroyStatus) == 'pass' ? 'pass': (x.testTypeCode == 'FPH' ? x.noDestroyStatus : x.destroyStatus) == 'fail' ? 'fail':''">{{$t('translationImage.inspectionResult')}}：{{checkResText( (x.testTypeCode == 'FPH' ? x.noDestroyStatus : x.destroyStatus))}}</view>
								</view>
							</scroll-view>
							<!-- :class="x.status == 'pass' ? 'pqc-begreen': x.status == 'fail' ? 'pqc-yesterday':'' " -->
							<!-- <uni-list class="pqc-list">
								<view class="pqc-begreen">
									<uni-list-item v-for="(x,i) in data.lookList" :key="i"
								      :title="'产线：' + x.productionLineName" :note="'检验结果：' + checkResText( (x.testTypeCode == 'FPH' ? x.noDestroyStatus : x.destroyStatus))"/>
								</view>
							</uni-list> -->
						</view>
						<view class="input-dialog-footer">
							<view class="input-dialog-button dialog-button-left" @click="close">
								{{$t('translationImage.close')}}
							</view>
						</view>
					</view>
				</uni-popup>
				<!-- 产线选择弹窗 -->
				<uni-popup ref="choiceDialog" type="center">
					<view class="input-dialog-box">
						<view class="input-dialog-content">
							<view class="gui-text" style="margin-bottom: 20rpx;">
								{{data.producCurrentPop.processName}}/{{data.producCurrentPop.shiftCode}}/{{data.producCurrentPop.testTypeName}}
							</view>
							<view class="uni-list">
								<radio-group @change="radioChange">
									<label class="gui-border-b" v-for="(item, index) in data.producLineList"
										:key="item.id">
										<view class="gui-flex gui-align-items-center">
											<radio style="transform:scale(0.7)" :value="item.id + ''" :checked="item.id == data.selectproducLine" />{{item.productionLineCode}}
										</view>
									</label>
								</radio-group>
							</view>
						</view>
						<view class="input-dialog-footer">
							<view class="input-dialog-button" @click="cancelFn">
								{{$t('popup.cancel')}}
							</view>
							<view class="input-dialog-button dialog-button-left" @click="choiceAffirm">
								{{$t('popup.confirm')}}
							</view>
						</view>
					</view>
				</uni-popup>
				<!-- 录入弹窗 -->
				<uni-popup ref="enterDialog" type="center">
					<view class="input-dialog-box">
						<view class="input-dialog-content">
							<view class="enter-dialog-content">
								<button type="primary" size="mini" class="left_button" @click="linePickUp">{{$t('locationBarcodeInfo.linePick')}}</button>
								<button type="primary" size="mini" @click="TrayPickUp">{{$t('locationBarcodeInfo.trayPick')}}</button>
							</view>
							<view>
								{{$t('locationBarcodeInfo.Explanation')}}
							</view>
				
						</view>
					</view>
				</uni-popup>
			</view>
		</template>
	</gui-page>
</template>

<script setup>
	// 引入 
	import {
		onShow,
	 } from '@dcloudio/uni-app';
	import {
		reactive,
		computed,
		onMounted,
		ref
	} from 'vue';
	import {
		flatten
	} from '@/utils/index.js'
	import {
		selectPqcCheckByShift,
		selectPqcItemCheckResult,
		selectMeetLine,
		fillStartTime,
		selectMeetLineSecond
	} from '@/api/api.js'
	import { basPdaOperationLogFn } from '@/utils/index.js';
	import { OPERATION_START, OPERATION_BOOK, OPERATION_LOOK } from '@/constant/index.js'
	import {
		navigate
	} from '@/utils/routerSkip.js'
	import {
		useStore
	} from "vuex";

	//JS国际化引入
	import { useI18n } from 'vue-i18n';
	const { t } = useI18n();

	let store = useStore();
	let showDialog = ref(null)
	let choiceDialog = ref(null)
	let enterDialog = ref(null)
	// 页面底部高度
	const navHeight = computed(() => {
		return Number(store.state.navHeight) + 36
	})
	// 文字显示
	const checkResText = computed(() => (status) => {
		let textList = [{
				value: 'waitCheck',
				text: t('translationImage.checkedNo')
			},
			{
				value: 'pass',
				text: t('translationImage.qualified')
			},
			{
				value: 'fail',
				text: t('translationImage.qualifiedNo')
			},
		]
		let text = textList.filter(x => x.value == status)[0].text;
		return text
	})
	const getTimeFn = (date) => {
		let y = date.getFullYear() //年
		let m = date.getMonth() + 1  //月，月是从0开始的所以+1
		let d = date.getDate() //日
		m = m < 10 ? "0" + m : m //小于10补0
		d = d < 10 ? "0" + d : d //小于10补0
		return y + "-" + m + "-" + d; //返回时间形式yyyy-mm-dd
	}
	// 前一天当班显示
	const isYesterday = computed(() => (data) => {
		let time = getTimeFn(new Date())
		let incoming = new Date(data).getTime()
		let now = new Date(time).getTime();
		
		if(incoming < now){
			return true
		}else{
			return false
		}
	})
	let data = reactive({
		testList: [], //页面表格检测数据
		lookList: [], //查看弹窗数据
		producLineList: [], //产线数据
		selectproducLine: '', //用户选择产线
		producCurrentPop: {}, //当前选择弹窗的信息
		lookPopInfo:{}, //当前查看弹窗的信息
		inputText:{} //点击录入时暂存信息
	})
	let inputText = reactive({})//点击录入时暂存信息
	onShow(() => {
		selectPqcCheckByShiftFn()
	})

	const radioChange = (etv) => {
		console.log(etv.detail.value);
		data.selectproducLine = etv.detail.value
	}
	// 录入检测
	const inputTest = (x, k, l) => {
		enterDialog.value.open()
		console.log(x.processName, '工序名字')
		console.log(x.processCode, '工序code')
		console.log(k.shiftCode, '班次code')
		console.log(k.checkDate, '检测日期')
		console.log(l.testTypeCode, '检测类型')
		console.log(k.pqcCount, '第几次')
		data.inputText = {
			processCode: x.processCode,
			processName: x.processName,
			shiftCode: k.shiftCode,
			pqcCount: k.pqcCount,
			checkDate: k.checkDate,
			testTypeCode: l.testTypeCode,
			selectType: 'detail'
		}
		// selectMeetLineSecond(param).then(res => {
		// 	console.log(res);
		// 	try {
		// 		let inputParameter = JSON.stringify(param)
		// 		let returnParameter = JSON.stringify(res)
		// 		let operationPicture = '过程检验'
		// 		let callInterface = res.rquestUrl
		// 		let opertionParmes = {
		// 			inputParameter,
		// 			returnParameter,
		// 			operationPicture,
		// 			callInterface,
		// 			responseCode:res.status,//返回状态
		// 			errorMessage:res.message,//错误信息
		// 			isPass:res.status == 200 ? 'Y' : 'N',//是否成功 Y N
		// 			operationType:OPERATION_BOOK
		// 		}
		// 		basPdaOperationLogFn(opertionParmes)
		// 	} catch (error) {
		// 	}
		// 	if (res.status == 200 && res.data.length > 0) {
		// 		navigate({
		// 			url:`/pages/qms/pqcInputNew?processCode=${x.processCode}&shiftCode=${k.shiftCode}&checkDate=${k.checkDate}&testTypeCode=${l.testTypeCode}&pqcCount=${k.pqcCount}&processName=${x.processName}`
		// 		})
		// 	} else if (res.status == 200 && res.data.length == 0){
		// 		uni.showToast({
		// 			title: t('JsInternational.chooseToStart'),
		// 			icon: "none"
		// 		});
		// 	} else {
		// 		uni.showToast({
		// 			title: res.message,
		// 			icon: "none"
		// 		});
		// 	}
		// })
	}
	//产线拿片
	const linePickUp = () =>{
		enterDialog.value.close()
		navigate({
			url:`/pages/qms/pqcInputNew?processCode=${data.inputText.processCode}&shiftCode=${data.inputText.shiftCode}&checkDate=${data.inputText.checkDate}&testTypeCode=${data.inputText.testTypeCode}&pqcCount=${data.inputText.pqcCount}&processName=${data.inputText.processName}&linePick=1&status=enter`
		})
	}
	//托盘拿片
	const TrayPickUp = () =>{
		enterDialog.value.close()
		navigate({
			url:`/pages/qms/pqcInputNew?processCode=${data.inputText.processCode}&shiftCode=${data.inputText.shiftCode}&checkDate=${data.inputText.checkDate}&testTypeCode=${data.inputText.testTypeCode}&pqcCount=${data.inputText.pqcCount}&processName=${data.inputText.processName}&linePick=0&status=enter`
		})
	}
	// 开始检测
	const beginTest = (x, k, l) => {
		console.log(x.processCode, '工序code')
		console.log(k.shiftCode, '班次code')
		console.log(k.checkDate, '检测日期')
		console.log(l.testTypeCode, '检测类型')
		console.log(k.pqcCount, '第几次')
		data.producCurrentPop = {
			processCode:x.processCode,
			shiftCode:k.shiftCode,
			checkDate:k.checkDate,
			testTypeCode:l.testTypeCode,
			pqcCount:k.pqcCount,
			processName:x.processName,
			shiftCode: k.shiftCode,
			testTypeName: l.testTypeName
		}
		let param = {
			processCode: x.processCode,
			shiftCode: k.shiftCode,
			pqcCount: k.pqcCount,
			checkDate: k.checkDate,
			testTypeCode: l.testTypeCode,
			selectType: 'startTime'
		}
		selectMeetLine(param).then(res=>{
			try {
				let inputParameter = JSON.stringify(param)
				let returnParameter = JSON.stringify(res)
				let operationPicture = '过程检验'
				let callInterface = res.rquestUrl
				let opertionParmes = {
					inputParameter,
					returnParameter,
					operationPicture,
					callInterface,
					responseCode:res.status,//返回状态
					errorMessage:res.message,//错误信息
					isPass:res.status == 200 ? 'Y' : 'N',//是否成功 Y N
					operationType:OPERATION_START
				}
				basPdaOperationLogFn(opertionParmes)
			} catch (error) {
			}
			console.log(res)
			choiceDialog.value.open()
			if (res.status == 200) {
				data.producLineList = res.data;
			}else{
				uni.showToast({
					title: res.message,
					icon: "none"
				});
			}
		})
		
	}
	// 获取今天所有的检测数据
	const selectPqcCheckByShiftFn = () => {

		selectPqcCheckByShift({}).then(res => {
			try {
				let inputParameter = JSON.stringify({})
				let returnParameter = JSON.stringify(res)
				let operationPicture = '过程检验'
				let callInterface = res.rquestUrl
				let opertionParmes = {
					inputParameter,
					returnParameter,
					operationPicture,
					callInterface,
					responseCode:res.status,//返回状态
					errorMessage:res.message,//错误信息
					isPass:res.status == 200 ? 'Y' : 'N',//是否成功 Y N
					operationType:OPERATION_LOOK
				}
				basPdaOperationLogFn(opertionParmes)
			} catch (error) {
			}
			if (res.status == 200) {
				// 重构json数据
				let list = res.data.map(x => {
					return x.pqcCountInfo.map((k, i) => {
						return {
							processCode: x.processCode,
							// processNameShow: x.processName + (i == 0 ? '' : i),
							processNameShow:x.processCode == 'JKJ' ? x.processName + (i + 1) : x.processName + (i == 0 ? '' : i),
							processName: x.processName,
							index: i,
							shifts: k.shifts
						}
					})
				})
				data.testList = flatten(list);
				data.testList.forEach(element => {
					let arr = element.shifts.filter((x)=>{
						return x.testCodes.length
					})
					element.shifts = arr
					element.shifts.forEach(x => {
						if( x.shiftCode=='MorningShift'){
							x.shiftCodeShow='Day'
						}else{
							x.shiftCodeShow='Night'
						}
						// x.shiftCodeShow = x.shiftCode.replace('Shift','')
						x.testCodes.forEach(i => {
							i.testTypeName = i.testTypeName.replace('_zh_CN','')
						});
					});
				});
	
			} else {
				uni.showToast({
					title: res.message,
					icon: "none"
				});
			}
		})
	}
	// 用户点击查看
	const look = (x, k, l) => {
		console.log(x.processCode, '工序code')
		console.log(x.processName, '工序')
		console.log(k.shiftCode, '班次code')
		console.log(k.checkDate, '检测日期')
		console.log(l.testTypeCode, '检测类型')
		console.log(l.testTypeName, '手段')
		console.log(k.pqcCount, '第几次')
		let param = {
			processCode: x.processCode,
			processName:x.processName,
			shiftCode: k.shiftCode,
			pqcCount: k.pqcCount,
			checkDate: k.checkDate,
			testTypeName:l.testTypeName,
			testTypeCode: l.testTypeCode
		}
		// data.lookPopInfo = {
		// 	processName:x.processName,
		// 	shiftCode: k.shiftCode,
		// 	testTypeName: l.testTypeName,
		// 	testTypeCode: l.testTypeCode
		// };
		navigate({
			url:`/pages/qms/pqcLook?processCode=${param.processCode}&processName=${param.processName}&shiftCode=${param.shiftCode}&checkDate=${param.checkDate}&testTypeName=${param.testTypeName}&testTypeCode=${param.testTypeCode}&pqcCount=${param.pqcCount}`
		})
		// selectPqcItemCheckResult(param).then(res => {
		// 	try {
		// 		let inputParameter = JSON.stringify(param)
		// 		let returnParameter = JSON.stringify(res)
		// 		let operationPicture = '过程检验'
		// 		let callInterface = res.rquestUrl
		// 		let opertionParmes = {
		// 			inputParameter,
		// 			returnParameter,
		// 			operationPicture,
		// 			callInterface,
		// 			responseCode:res.status,//返回状态
		// 			errorMessage:res.message,//错误信息
		// 			isPass:res.status == 200 ? 'Y' : 'N',//是否成功 Y N
		// 			operationType:OPERATION_LOOK
		// 		}
		// 		basPdaOperationLogFn(opertionParmes)
		// 	} catch (error) {
		// 	}
		// 	console.log(res, 'hhhhhh')
		// 	if (res.status == 200) {
		// 		data.lookList = res.data
		// 		showDialog.value.open()
		// 	} else {
		// 		uni.showToast({
		// 			title: res.message,
		// 			icon: "none"
		// 		});
		// 	}
		// })
	}
	// 选择产线弹窗取消
	const cancelFn = () => {
		choiceDialog.value.close()
	}
	// 选择产线弹窗确认
	const choiceAffirm = () => {
		uni.showModal({
			content: t('JsInternational.submitConfirm'),
			success: (res) => {
				if (res.confirm) {
					submitProductionLine()
				} else if (res.cancel) {
					console.log('用户点击取消');
				}
			}
		});
	}
    const submitProductionLine = () => {
		console.log(data.producCurrentPop)
		fillStartTime({
			id: data.selectproducLine,
			testTypeCode: data.producCurrentPop.testTypeCode
		}).then(res=>{
			if (res.status == 200) {
				selectPqcCheckByShiftFn()
				uni.showToast({
					title: t('JsInternational.inspectionTime'),
					icon: "none"
				});
				choiceDialog.value.close()
			} else {
				uni.showToast({
					title: res.message,
					icon: "none"
				});
			}
		})
	}
	// 关闭弹窗
	const close = () => {
		showDialog.value.close()
	}
</script>

<style lang="scss" scoped>
	.space-tdodd{
		background: #e6e6e6;
		position: relative;
	}
	.space-tdeven{
		background: #fff;
		position: relative;
	}
	.spaceline{
		position: absolute;
		top: 0px;
		right: 100%;

	}
	.test-result-item {
		line-height: 36rpx;
	}
	.scroll-view{
		width: 100%;
		height: 500rpx;
	}
	.itemview{
		padding: 12rpx 15rpx;
		.itemview-title{
			font-size: 14px;
			color: #3b4144;
		}
		.itemview-sub{
			font-size: 12px;
			color: #999;
		}
		.pass{
			color: rgb(55, 136, 108);
		}
		.fail{
			color: red;
		}
	}

	.pqc-table {
		font-size: 26rpx;
	}

	.choiceDialog-title {
		text-align: center;
		line-height: 58rpx;
	}
	.pqc-list{
		::v-deep  .uni-list-item__container{
			padding: 8rpx 30rpx;
		}
	}
	.pqc-yesterday{
		background-color: red;
		color: #fff;
	}
	.pqc-begun{
		background-color: #55ff00;
		color: #fff;
	}
	.pqc-begreen{
		background-color: rgb(55, 136, 108);
		color: #fff;
	}
	.enter-dialog-content{
		text-align: center;
		padding: 14px 0;
	}
	.left_button{
		margin-right: 8px;
	}
</style>
